<template>
  <el-row :gutter="20" style="height: 30px">
    <el-col :span="6" :offset="3">
      <el-image :src="logoImage" style="margin-left: 100px;"
                fit="fill"></el-image>
    </el-col>
    <el-col :span="6" :offset="6">
      <div class="headerInfo">
        <el-link icon="fa fa-home fa-2x" @click="gotoHome" :underline="false">返回首页</el-link>
        <el-link :underline="false">您好，{{name}}</el-link>
        <el-link @click="doLogout" :underline="false">【注销】</el-link>
      </div>
    </el-col>
  </el-row>
</template>

<script>
export default {
  name: "Header",
  data(){
    return {
      name:'',
      logoImage:'./static/logo2.png'
    }
  },
  mounted() {
    this.name = sessionStorage.getItem("name");
  },
  methods:{
    doLogout(){
      sessionStorage.removeItem("token");
      sessionStorage.removeItem("name");
      this.$router.push("login");
    },
    registerUser(){
      // this.$message('注册用户');
      this.$message({
        showClose: true,
        message: '注册用户'
      });
    },
    gotoPersonInfoPage() {
      this.$router.push("PersonInfoPage");
    },
    gotoHome(){
      this.$router.push("home");
    }
  }
}
</script>

<style scoped>
.headerInfo{
  font-size: 24px;
  margin-top: 30px;
  /*font-family: '黑体'!important;*/
  font-family: '微软雅黑'!important;
}
</style>